<template>
	<view class="salesReturnAddress">
		<zhu-nav-bar title="退货地址" bgColor="#fff" leftColor="#000" sizeColor="#111"></zhu-nav-bar>
		<view class="salesReturnAddress-plate-1">
			<view class="item">
				<text>收货人</text>
				<input type="text" value="" placeholder="填写收货人" />
			</view>
			<view class="item">
				<text>手机号</text>
				<input type="number" value="" placeholder="填写收货人手机号" />
			</view>
			<view class="item">
				<text>所在地区</text>
				<view class="btm">
					<text>{{address}}</text>
					<u-icon name="arrow-right" size="16" color="#999"></u-icon>
				</view>
			</view>
			<view class="item">
				<text>详细地址</text>
				<input type="text" value="" placeholder="填写详细地址" />
			</view>
			<view class="item">
				<text>备注</text>
				<view class="textarea">
					<textarea value="" placeholder="请输入备注信息" />
				</view>
			</view>
		</view>
		<button class="big-bg-btn">确定</button>
	</view>
</template>

<script>
	import zhuNavBar from '@/pages/components/zhuNavBar.vue'
	export default {
		data() {
			return {
				address:''
			};
		},
		components:{
			zhuNavBar
		}
	}
</script>

<style lang="scss" scoped>
.salesReturnAddress{
	width: 100vw;
	min-height: 100vh;
	background-color: #F9F9F9;
	.salesReturnAddress-plate-1{
		padding-top: $hegiht-top;
		padding-left: 30rpx;
		padding-right: 30rpx;
		background-color: #fff;
		.item{
			min-height: 145rpx;
			display: flex;
			justify-content: center;
			flex-direction: column;
			border-bottom: 1rpx solid #eee;
			>text{
				font-size: 24rpx;
				font-weight: 700;
				color: #3989ff;
				margin-bottom: 10rpx;
			}
			input{
				font-size: 30rpx;
				font-weight: 500;
				color: #333333;
			}
			.btm{
				display: flex;
				align-items: center;
				justify-content: space-between;
				text{
					font-size: 30rpx;
					font-weight: 500;
					color: #333333;
				}
			}
			.textarea{
				width: 690rpx;
				height: 260rpx;
				background: #e9e9e9;
				border-radius: 20rpx;
				padding: 30rpx;
				textarea{
					font-size: 30rpx;
					font-weight: 500;
					color: #333333;
				}
			}
		}
		.item:last-child{
			margin: 30rpx 0;
			>text{
				color: #333;
			}
		}
	}
}
</style>
